<template>
  <div>
    <h3>欢迎光临vue开发的收银系统水果店</h3>
    <br>
    <h4>苹果{{price}}￥/斤,折扣 {{discount}}折 </h4>
    请输入您要购买的斤数 <input type="number" v-model="num">
    <br>
    <button @click="getSum">结账买单</button>
    <h4>结账单：总价 {{total}}元 折后价：{{dcps}}元 省了 {{ps}}元</h4>
  </div>
</template>

<script>
export default {
  data(){
    return {
      num:0,
      price:10,
      discount:8,
      total:'1',
      dcps:'1',
      ps:'1'
    }
  },
  methods:{
    getSum(){
      this.total = this.price * this.num
      this.dcps = this.total - this.total * 8 / 100
      this.ps = (this.total - this.dcps).toFixed(0)
      console.log(this.dcps);
    }
  }
}
</script>

<style>

</style>